
<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8"><link rel="icon" href="https://jscdn.com.cn/highcharts/images/favicon.ico">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <style>
            /* css 代码  */
        </style>
        <script src="https://code.highcharts.com.cn/highcharts/highcharts.js"></script>
        <script src="https://code.highcharts.com.cn/highcharts/modules/exporting.js"></script>
        <script src="https://code.highcharts.com.cn/highcharts/modules/oldie.js"></script>
        <script src="https://code.highcharts.com.cn/highcharts-plugins/highcharts-zh_CN.js"></script>
        <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
        <link rel="stylesheet" href="/layui-v2.5.5/layui/css/layui.css"  media="all">
        <script src="/layui-v2.5.5/layui/layui.js" charset="utf-8"></script>
    </head>
    <body>

        <div class="layui-form-item">
    <div class="layui-inline">
        <label class="layui-form-label">中文版</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input" id="test1" placeholder="输入要查询的日期" autocomplete="off">
        </div>
        <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1" id="search">立即提交</button>
    </div>
        </div>



    <div id="container" style="min-width:400px;height:400px"></div>

        <script>
            // JS 代码
            $(document).ready(function () {
                list();
            })
            function list() {
                var dates=$("#test1").val();
              console.log(dates);
                $.ajax({
                    url: 'get_today_data',
                    data:{'date':dates},
                    type:'GET',
                    success: function (res) {
                        console.log(res);
                        var res = JSON.parse(res);
                        //var type=typeof (res['totalprice']);
                        //console.log(type);
                        var str = "";
                        //var totalprice=JSON.stringify(res['totalprice']);
                        for (var i = 0; i < res['totalprice'].length; i++) {
                            str += res['totalprice'][i] + ','
                        }
                        str = '[' + str.substr(str, str.length - 1) + ']';
                        console.log(str);
                        var chart = Highcharts.chart('container', {

                            chart: {
                                type: 'line'
                            },
                            title: {
                                text: '当天销售额'
                            },
                            subtitle: {
                                text: '数据来源: WorldClimate.com'
                            },
                            xAxis: {
                                categories: res['hour']
                            },
                            yAxis: {
                                title: {
                                    text: '单位 (万元)'
                                }
                            },
                            plotOptions: {
                                line: {
                                    dataLabels: {
                                        // 开启数据标签
                                        enabled: true
                                    },
                                    // 关闭鼠标跟踪，对应的提示框、点击事件会失效
                                    enableMouseTracking: true
                                }
                            },
                            series: [{
                                name: res.time,
                                data: eval(str)
                            }]
                        });
                    }
                });
            };
        </script>
    <script>
        layui.use('laydate', function(){
            var laydate = layui.laydate;
            //日期时间选择器
            //常规用法
            laydate.render({
                elem: '#test1'
            });
        });
$("#search").click(function(){

 list();

})
    </script>

    </body>
</html>